//  没有图片的
<style lang="less" scoped>
@import "../assets/css/config.less";
.flex-row{
  display: flex;
  justify-content: start;
  align-items: center;
}
.flex-column{
  display: column;
  justify-content: start;
  align-items: center;
}


.redio-btn{
  width: 14px;
  height: 14px;
  border: 1px solid #D9D9DC;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  .point{
    width: 5px;
    height: 5px;
    background-color: @white;
    border-radius: 50%;
  }
  &.active{
    background-color: @color2;
  }
}
</style>
<template>
  <div :class="isrow?'flex-row':'flex-column'">
    <div class="flex-row" style="margin: 10px 0;cursor: default;" v-for="(item, index) in options" :key="index" :class="choose===index ? 'active' : ''" @click="chooseItem(index)">
      <div class="redio-btn" :class="choose===index ? 'active' : ''">
        <div class="point"></div>
      </div>
      <div style="margin-left: 8px">{{ item }}</div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'RedioGroup',
  data() {
    return {
      choose: 0
    }
  },
  props: {
    'options': {
      type: Array
    }, 
    'isrow': {
      type: Boolean,
      default: false
    }
  },

  methods: {
    chooseItem(index) {
      this.choose = index;
      this.$emit("getChoose",index)
    }
  }
}
</script>